import React, { Component } from 'react'
import styles from './Tabbar.module.scss'
import { NavLink } from 'react-router-dom'

class Tabbar extends Component {
  constructor(props){
    super(props)
    this.group = this.props.group||1
  }
  
  render() {
    return (
      <div className={styles.Tabbarbox}>
        <div className={styles.Tabbar}>
          <NavLink activeStyle={{color: '#23b383'}} to='/bookrack' className={styles.item}>
            <div className={"icon iconfont icon-shuji "+styles.itemicon}></div>
            <div>书架</div>
          </NavLink>
          <NavLink activeStyle={{color: '#23b383'}} to='/booktown' className={styles.item}>
            <div className={"icon iconfont icon-icon-- "+styles.itemicon}></div>
            <div>书城</div>
          </NavLink>
          <NavLink activeStyle={{color: '#23b383'}} to={'/sort/'+this.group} className={styles.item}>
            <div className={"icon iconfont icon-fenlei "+styles.itemicon}></div>
            <div>分类</div>
          </NavLink>
          <NavLink activeStyle={{color: '#23b383'}} to='/my' className={styles.item}>
            <div className={"icon iconfont icon-daohanglan-05 "+styles.itemicon}></div>
            <div>我的</div>
          </NavLink>
        </div>
      </div>
    )
  }
}
export default Tabbar;
